<template>
	<view class="content">
		<view class="m-top">
			<view class="txt">
				币种
			</view>
			<view class="txt1">
				{{symbol}}-{{contract_type}}
			</view>
		</view>
		
			<view class="item-list">
				<view class="txt2">
					提币地址
				</view>
				<view class="flex">
					<u-input v-model="payee_address" :border="false"  placeholder="输入或长按粘贴地址"/>
					<u-icon name="scan" color="#000" size="28" @click="sao()"></u-icon>
				</view>
			</view>
			<view class="item-list">
				<view class="flex">
					<view class="txt2">
						数量
					</view>
					<view class="txt3">
						USDT
					</view>
				</view>
				
				<view class="flex">
					<u-input v-model="cash_money" type="number" :border="false"  placeholder="最小转账数量0.1"/>
					<view class="bnts" @click="all">全部	</view>
				</view>
			</view>
			<view class="txt6">
					可用{{money}}USDT
			</view>
			<view class="item-list">
				<view class="txt2">
					手续费
				</view>
				<view class="flex">
					<u-input v-model="cash_rate" disabled="" :border="false" placeholder="0.001" />
					<view class="">	USDT</view>
				</view>
			</view>
			<view class="item-list">
				<view class="txt2">
					交易密码
				</view>
				<view class="flex">
					<u-input v-model="safety_code" :border="false"  placeholder="请输入交易密码" />				
				</view>
			</view>
			<view class="item-list">
				<view class="txt2">
					手机号
				</view>
				<view class="flex">
					<u-input v-model="mobile" disabled :border="false"  placeholder="请输入手机号" />				
				</view>
			</view>
			<view class="item-list">
				<view class="txt2">
					短信验证码
				</view>
				<view class="flex">
					<u-input v-model="verify_code" :border="false"  placeholder="请输入短信验证码" />
					<view class="btns" @click="getCode">{{codeText}}</view>
					<u-verification-code ref="uCode" @change="codeChange"></u-verification-code>
				</view>
			</view>
			<view class="btn-bottom" @click="submit()">
				提币
			</view>
			<tfgg-verify @result='verifyResult' ref="verifyElement"></tfgg-verify>
	</view>
</template>

<script>
	import tfggVerify from "@/components/tfgg-verify/tfgg-verify.vue";
	export default {
		components: {
			"tfgg-verify": tfggVerify
		},
		data() {
			return {
				codeText: '获取验证码', //获取验证码
				payee_address:'',//提币地址
				cash_money:'',//提币金额
				safety_code:'',//交易码
				mobile:'',//手机号
				verify_code:'',//验证码
				symbol:'',//币种
				contract_type:'',//币种类型
				cash_rate:'',//手续费
				money:''
			}
		},
		onShow() {
			try {
			    const member = uni.getStorageSync('member');
				const currency = uni.getStorageSync('currency');
				const userInfo = uni.getStorageSync('userInfo');
			    if (member) {
			        console.log('当前数据------',member);
					this.money = member.money
			    }
				if(currency){
					this.symbol= currency.symbol
					this.contract_type= currency.contract_type
					this.cash_rate= currency.cash_rate
				}
				if(userInfo){
					this.mobile = userInfo.mobile
				}
			} catch (e) {
			    // error
			}
		},
		onLoad(e) {
			console.log('当前页面参数------',e)
			
		},
		methods: {
			//扫码
			sao(){
				uni.scanCode({
				    success: function (res) {
				        console.log('条码内容：' + res.result);
						this.payee_address=res.result
				    }
				});
			},
			//提币
			submit(){
				if(!this.payee_address){
					uni.showToast({
					    title:'提币地址不正确',
					    duration: 1000,
						icon:'none'
					});
					return
				}
				if(!this.cash_money){
					uni.showToast({
					    title:'提币金额不正确',
					    duration: 1000,
						icon:'none'
					});
					return
				}
				if(!this.safety_code){
					uni.showToast({
					    title:'支付密码不正确',
					    duration: 1000,
						icon:'none'
					});
					return
				}
				if(!this.mobile){
					uni.showToast({
					    title:'手机号不正确',
					    duration: 1000,
						icon:'none'
					});
					return
				}
				if(!this.verify_code){
					uni.showToast({
					    title:'验证码不正确',
					    duration: 1000,
						icon:'none'
					});
					return
				}
				this._submit()
			},
			_submit(){
				this.$http({
					url:this.$api.cash,
					method:'POST',
					hideLoading:true,
					data:{
						symbol:this.symbol,
						payee_address:this.payee_address,
						cash_money:this.cash_money,
						safety_code:this.safety_code,
						mobile:this.mobile,
						verify_code:this.verify_code
					},
					success:res=>{
						if(res.code == 200){
							uni.showToast({
							    title:res.msg,
							    duration: 1000,
								icon:'none'
							});
						}
						setTimeout(()=>{
							uni.navigateBack();
						},1000)
						console.log('详情----------',res)
					},
					complete:e=>{
						uni.stopPullDownRefresh();
					}
				})
			},
			//全部
			all(){
				this.cash_money = this.money
			},
			verifyResult(res) {
				if (res) {
					this.$refs.verifyElement.reset(); //校验成功重置插件
					console.log('验证成功')
				}
				this.sendMessage(this.mobile)
				console.log(res);
			},
			//获取验证码
			codeChange(text) {
				this.codeText = text
			},
			getCode() {
				if (!this.mobile) {
					this.$u.toast('手机号格式不正确');
					return
				}
				if (this.$refs.uCode.canGetCode) {
					// uni.showLoading({
					// 	title: '正在获取验证码'
					// })
					this.$refs.verifyElement.show();
			
				} else {
					this.$u.toast('倒计时结束后再发送');
				}
			},
			// 发送验证码
			sendMessage(e) {
				this.$http({
					url: this.$api.shayuSms,
					method: 'POST',
					hideLoading: true,
					data: {
						mobile: e,
					},
					success: res => {
						// 通知验证码组件内部开始倒计时
						this.$refs.uCode.start();
						console.log('短信验证码----------', res)
					},
					fail: err => {
			
					},
					complete: e => {
						uni.hideLoading();
					}
				})
			},
		}
	}
</script>

<style scoped>
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #fff;
}
.m-top{
	font-weight: 600;
	color: #131415;
	line-height: 40rpx;
	height: 158rpx;
	border-bottom: 1px solid #F8F8F8;
	width: 100%;
	padding: 32rpx;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: flex-start;
	
}
.txt{
	font-size: 28rpx;
}
.txt1{
	margin-top: 24rpx;
	font-size: 24rpx;
}
.item-list{
	height: 160rpx;
	border-bottom: 1px solid #F8F8F8;
	text-align: left;
	    padding: 0 24rpx;
		width: 100%;
}
.txt2{
	font-size: 28rpx;
	font-weight: 600;
	color: #131415;
	line-height: 40px;
}
.flex{
	display: flex;
	justify-content:space-between;
	align-items: center;
}
.txt3{
	font-size: 24rpx;
	font-weight: 600;
	color: #BBBBBB;
	line-height: 34px;}
	.bnts{
		border-radius: 20rpx;
		border: 1px solid #d8d8d8;
		padding: 5rpx 20rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: #BBBBBB;
		line-height: 34rpx;
	}
	.txt6{
		font-size: 24rpx;
		font-weight: 400;
		color: #999999;
		line-height: 34rpx;
		margin-top: 10rpx;
		width: 100%;
		padding-left: 28rpx;
		}
		.btn-bottom{
			width: 694rpx;
			height: 80rpx;
			background: #2F73FD;
			box-shadow: 0px 4px 8px 0px rgba(166,196,255,1);
			border-radius: 40rpx;
			text-align: center;
			line-height: 80rpx;
			color: #fff;
			font-size: 32rpx;
			margin-top: 50rpx;
			margin-bottom: 150rpx;
		}
</style>
